<template>
  <div>
    <NavTop class="nav"></NavTop>
    <NavBlank></NavBlank>
    <div class="video-main">
      <div class="left">
        <VideoObj></VideoObj>
        <VideoComment></VideoComment>
      </div>
      <div class="right">
        <VideoAuthor></VideoAuthor>
        <VideoBarrage></VideoBarrage>
        <VideoEpisode></VideoEpisode>
      </div>
    </div>
  </div>
</template>

<script>
import NavTop from '@/components/nav-top'
import NavBlank from '@/components/nav-blank'
import VideoObj from './video-info'
import VideoAuthor from './video-author'
import VideoBarrage from './video-barrage'
import VideoEpisode from './video-episode'
import VideoComment from './video-comment'
export default {
  name: "video",
  components: {
    NavTop,
    VideoObj,
    NavBlank,
    VideoAuthor,
    VideoBarrage,
    VideoEpisode,
    VideoComment
  }
}
</script>

<style scoped>
.nav {
  color: #000 !important;
  box-shadow: 0 2px 4px #00000014;
  background-color: white;
}

.video-main {
  display: flex;
  justify-content: space-between;
  margin: 0 200px;
  margin-top: 20px;
}

.left {
  width: 65%;
}

.right {
  width: 33%;
}
</style>